<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>点击</title>
</head>
<body>
	<h1 id="word">我是文字</h1>
	<button id="show">显示</button>
	<button id="hide">隐藏</button>
	<button id="toggle_id">隐藏+显示</button>
</body>
<script src="../js/jquery.min.js"></script>
<script>
   $(document).ready(()=>{
	   $("#hide").click(()=>{
		   //fadeOut
		  $("#word").slideUp(500,()=>{
			  console.log("我已经隐藏了");
			  //触发事件:
			  $("#show").click();
		  }); 
	   });
	   $("#show").click(()=>{
		   //fadeIn
		   $("#word").slideDown(500,()=>{
			   console.log("我又显示了");
		   }); 
	   });
	   $("#toggle_id").click(function(){
	   		  $("#word").slideToggle(500,function(){
				  console.log("[slideToggle]");
			  })
	   });
   });
</script>
</html>
